window.onload = function() {
    let inputs = document.querySelectorAll('.inputs input')
    let imgs = document.querySelectorAll('.inputs img')
    let prompts = document.querySelectorAll('.prompts')
    console.log(prompts);
    inputs.forEach(function(input, index) {
        input.addEventListener('mouseleave', function() {
            //第一个input
            if (inputs[0].value.length < 6 || inputs[0].value.length > 20) {
                prompts[0].style.opacity = 1
            } else {
                prompts[0].style.opacity = 0
            }
            // //第二个input
            // if (inputs[1].value.length != 11) {
            //     prompts[1].style.opacity = 1

            // } else {
            //     prompts[1].style.opacity = 0
            // }
            //删除图片是否出现
            if (this.value.length !== 0) {
                imgs[index].style.display = 'block'
            } else {
                imgs[index].style.display = 'none'
            }
        })
    })
    imgs.forEach(function(img, i) {
        img.addEventListener('click', function() {
            inputs[i].value = null
        })
    })

}